<template>
  <div v-if="!$route.meta.keepAlive" style="width:100vw ;height: 100vh; position:absolute; top: 0; overflow: hidden">
    <img :src="cover" alt="" style="width: 100vw; z-index: 0">
  </div>
  <router-view></router-view>

</template>

<script>
// import HelloWorld from './components/HelloWorld.vue'

export default {
  name: 'App',
  components: {
    // HelloWorld
  },
  data() {
    return {
      cover: require('./assets/images/apple.jpg'),
    }
  }
}
</script>

<style>
html {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
}

body {
  margin: 0;
  padding: 0;
}

#app {
  /*font-family: Avenir, Helvetica, Arial, sans-serif;*/
  /*-webkit-font-smoothing: antialiased;*/
  /*-moz-osx-font-smoothing: grayscale;*/
  /*text-align: center;*/
  /*color: #2c3e50;*/
}

.slide-enter-from {
  transform: translateX(100%);
}

.slide-enter-to {

  transform: translateX(-100%) scale(0) rotate(180deg);
  opacity: 0;
  transform-origin: center;
}

.slide-enter-from, .slide-enter-to {
  transition: all 0.5s linear;
}
</style>
